<template>
  <view class="login-container">
    <!-- 品牌区域 -->
    <view class="brand-area">
      <image class="logo" src="@/static/images/logo.png" mode="aspectFit"></image>
      <text class="welcome-text">欢迎使用我们的服务</text>
    </view>

    <!-- 登录按钮区域 -->
    <view class="login-area">
      <button class="wechat-login-btn" @click="handleWechatLogin">
        <uni-icons
          class="wechat-icon"
          type="weixin"
          size="28"
          color="#ffffff"
        ></uni-icons>
        <text class="login-text">{{
          loading ? '登陆中...' : '微信一键登陆'
        }}</text>
      </button>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      loading: false,
      logoUrl:
        'https://ai-public.mastergo.com/ai/img_res/4734dbc9d665834ce2f3374d0df35981.jpg'
    }
  },

  methods: {
    async handleWechatLogin() {
      if (this.loading) return
      this.loading = true
      try {
        await getApp().getUserProfile()

        // 获取当前页面栈
        const pages = getCurrentPages()

        if (pages.length > 1) {
          // 有上一页时返回
          uni.navigateBack({
            delta: 1
          })
        } else {
          // 无上一页时跳转到首页
          uni.reLaunch({
            url: '/pages/home/index'
          })
        }
      } catch (err) {
        console.error('登录失败', err)
        uni.showToast({
          title: '登录失败',
          icon: 'none'
        })
      } finally {
        this.loading = false
      }
    }
  }
}
</script>

<style>
page {
  height: 100%;
  background-color: #ffffff;
  overflow: hidden;
}

.login-container {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 200rpx;
  padding: 0 40rpx;
}

.brand-area {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 80rpx;
}

.logo {
  width: 200rpx;
  height: 200rpx;
  margin-bottom: 20rpx;
}

.brand-name {
  font-size: 32px;
  color: #333333;
  font-weight: bold;
  margin-bottom: 16rpx;
}

.welcome-text {
  font-size: 14px;
  color: #666666;
}

.login-area {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.wechat-login-btn {
  width: 80%;
  height: 88rpx;
  background-color: #07c160;
  border-radius: 44rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 40rpx;
  position: relative;
  transition: all 0.3s;
}

.wechat-login-btn.loading {
  background-color: #06a954;
  opacity: 0.8;
}

.wechat-icon {
  margin-right: 16rpx;
}

.login-text {
  color: #ffffff;
  font-size: 16px;
}
</style>
